<template>
  <div class="box">
    <div class="header">
      <div class="header_item">
        <el-menu
          :default-active="activeIndex2"
          class="el-menu-demo"
          mode="horizontal"
          :ellipsis="false"
          active-text-color="#ffd04b"
          @select="handleSelect"
        >
          <div class="header_title_menu">
            <div class="log_title"></div>

            <el-menu-item index="1" style="margin-right: 30px">进入平台</el-menu-item>
          </div>
        </el-menu>
      </div>
    </div>
    <div class="box-sec">牙医信息医生管理系统</div>
  </div>
</template>

<script lang="ts" setup>
import axios from "axios";
import { ref } from "vue";
import router from "@/router";

const dialogTableVisible = ref(false);
const pageSize = ref(1);
const pageItem = ref(5);
const pageTotal = ref(0);
const tableData = ref([]);

const small = ref(false);
const background = ref(false);
const disabled = ref(false);

const handleSizeChange = (val: number) => {
  console.log(`${val} items per page`);
};
const handleCurrentChange = (val: number) => {
  console.log(`current page: ${val}`);
};

const activeIndex2 = ref("0");

const handleSelect = (key: string, keyPath: string[]) => {
  if (key == "1") {
    router.push("/doctor/user-info");
  }
};
</script>

<style lang="scss" scoped>
.box {
  height: 100vh;
  width: 100vw;
  //background: linear-gradient(to right, #ecf5ff, #e3c5b8);
  background: url("/环境.jpg") no-repeat fixed;
  background-size: cover; /* 或 contain，按需选择 */
  .box-sec {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 44px;
    height: 90%;
  }
  .header {
    display: flex;
    align-items: center;
    justify-content: center;
    .header_item {
      width: 100%;
      .header_title_menu {
        width: 100%;
        display: flex;
        justify-content: space-between;
      }
    }
    .log_title {
      display: flex;
      align-items: center;
    }
  }
}
.text {
  font-size: 14px;
}

.item {
  padding: 18px 0;
}

.box-card {
  width: 100%;
  .box_left {
    width: 70%;
    text-align: left;
  }
  .box_right {
    width: 30%;

    text-align: right;
  }
}
</style>
